<template>
  <div class="app-container">
    <el-row :gutter="20">
      <el-col :span="8">
        <el-form   label-width="80px" :model="formLabelAlign">
          <el-form-item label="名称">
            <el-input v-model="formLabelAlign.name"></el-input>
          </el-form-item>
          <el-form-item label="真实姓名">
            <el-input v-model="formLabelAlign.realname"></el-input>
          </el-form-item>
          <el-form-item label="真实姓名">
            <el-input v-model="formLabelAlign.realname"></el-input>
          </el-form-item>
          <el-form-item label="教室">
            <el-select v-model="formLabelAlign.cid" placeholder="请选择">
              <el-option
                v-for="item in classroomlist"
                :key="item.id"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="密码">
            <el-input v-model="formLabelAlign.password"></el-input>
          </el-form-item>
          <el-form-item label="操作">
            <el-button class="el-button--success" @click="doadd">添加</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getAllClassRoom } from "@/api/admin";
import { Message } from '_element-ui@2.3.4@element-ui'

export default {
  data() {
    return {
      list: null,
      listLoading: true,
      formLabelAlign:{},
      classroomlist:[]
    };
  },

  created() {
    this.getClassList();
  },
  methods: {
    getClassList() {
      this.listLoading = true;
      getAllClassRoom().then((response) => {

        console.log('response')
        console.log(response.info)
        this.classroomlist = response.info;
        this.listLoading = false;
      }).catch(err=>{
        this.$notify({
          title: '失败',
          message: '添加失败！',
          type: 'error'
        });

      })
    },
    doadd() {
      this.listLoading = true;
      addTeacher(this.formLabelAlign).then((response) => {

        this.$notify({
          title: '成功',
          message: '添加成功！',
          type: 'success'
        });

        this.listLoading = false;
      }).catch(err=>{
        this.$notify({
          title: '失败',
          message: '添加失败！',
          type: 'error'
        });

      })
    },
  },
};
</script>
